<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <title>欢迎使用 IMOOC Cake 后台管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="../assets/css/theme.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/admin-forms.css">
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
</head>

<body class="admin-validation-page" data-spy="scroll" data-target="#nav-spy" data-offset="200">
<div id="main">
    <header class="navbar navbar-fixed-top navbar-shadow">
        <div class="navbar-branding">
            <a class="navbar-brand" href="../index.html">
                <H3>Love Cake 后台管理系统</H3>
            </a>
            <span id="toggle_sidemenu_l" class="ad ad-lines"></span>
        </div>
    </header>
    <aside id="sidebar_left" class="nano nano-light affix">
        <div class="sidebar-left-content nano-content">
            <header class="sidebar-header">
                <div class="sidebar-widget author-widget">
                    <div class="media">
                        <a class="media-left" href="#">
                            <img src="../images/head.jpg" class="img-responsive">
                        </a>
                        <div class="media-body">
                            <div class="media-author">管理员</div>
                            <div class="media-links">
                                <a href="/user/login">退出</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="sidebar-widget search-widget hidden">
                    <div class="input-group">
                        <span class="input-group-addon">
                        <i class="fa fa-search"></i>
                        </span>
                        <input type="text" id="sidebar-search" class="form-control" placeholder="Search...">
                    </div>
                </div>
            </header>
            <ul class="nav sidebar-menu">
                <li class="sidebar-label pt20">商品管理</li>
                <li class="active">
                    <a href="/cake_list">
                        <span class="glyphicon glyphicon-book"></span>
                        <span class="sidebar-title">商品列表</span>
                    </a>
                </li>
                <li>
                    <a href="/cake_add">
                        <span class="glyphicon glyphicon-home"></span>
                        <span class="sidebar-title">商品上架</span>
                    </a>
                </li>
                <li class="sidebar-label pt20">分类管理</li>
                <li class="active">
                    <a href="/catalog_list">
                        <span class="glyphicon glyphicon-book"></span>
                        <span class="sidebar-title">分类列表</span>
                    </a>
                </li>
                <li>
                    <a href="/catalog_add">
                        <span class="glyphicon glyphicon-home"></span>
                        <span class="sidebar-title">添加分类</span>
                    </a>
                </li>
            </ul>
            <div class="sidebar-toggle-mini">
                <a href="login.jsp">
                    <span class="fa fa-sign-out"></span>
                </a>
            </div>
        </div>
    </aside>
<section id="content_wrapper">
    <section id="content" class="table-layout animated fadeIn">
        <div class="tray tray-center">
            <div class="content-header">
                <h2> 上架新商品</h2>
            </div>
            <div class="admin-form theme-primary mw1000 center-block" style="padding-bottom: 175px;">
                <div class="panel heading-border">
                    <form  id="admin-form" method="post" action="/editCake" enctype="multipart/form-data">
                        <div class="panel-body bg-light">
                            <div class="section row">
                                <div class="col-md-1" style="margin-top: 10px;"><b>名称</b></div>
                                <div class="col-md-5">
                                    <label for="title" class="field prepend-icon">
                                        <input type="text" name="cakeName" id="title" class="gui-input" placeholder=${cakeInfo.cakeName} required value=${cakeInfo.cakeName}>
                                        
                                        <label for="title" class="field-icon">
                                            <i class="fa fa-navicon"></i>
                                        </label>
                                    </label>
                                </div>
                                <div class="col-md-1" style="margin-top: 10px;"><b>状态</b></div>
                                <div class="col-md-3" style="margin-top: 10px;">
                                    <input type="radio" name="state" id="status1" class="radio" value="普通" checked />
                                    <label for="status1">普通</label>
                                    <input type="radio" name="state" id="status2" class="radio" value="推荐" />
                                    <label for="status2">推荐</label>
                                    <input type="radio" name="state" id="status3" class="radio" value="特卖" />
                                    <label for="status3">特卖</label>
                                </div>
                            </div>
                            <div class="section row">
                                <div class="col-md-1" style="margin-top: 10px;"><b>图片</b></div>
                                <div class="col-md-1" id="showImage"></div>
                                <div class="col-md-7">
                                    <img src="${cakeInfo.picUrl}" width="50"/>
                                    <input type="hidden" name="imageUrl" id="imageUrl" value=${cakeInfo.picUrl}/>
                                    <input type="file" name="picUrl" id="image" class="gui-file" placeholder="图片..." >
                                </div>
                            </div>
                            <div class="section row">
                            <div class="col-md-1" style="margin-top: 10px;"><b>所属分类</b></div>
                            <div class="col-md-2">
                                <label class="field select">
                                    <select id="language" name="cakeType">
                                        <option value=${cakeInfo.cakeType}>${cakeInfo.cakeType}</option>

                                        
                                    </select>
                                    <i class="arrow double"></i>
                                </label>
                            </div>
                            <div class="col-md-1" style="margin-top: 10px;"><b>口味</b></div>
                            <div class="col-md-2">
                                <label for="taste" class="field prepend-icon">
                                    <input type="text" name="taste" id="taste" class="gui-input" placeholder=${cakeInfo.taste} required value=${cakeInfo.taste}>
                                    <label for="taste" class="field-icon">
                                        <i class="fa fa-coffee"></i>
                                    </label>
                                </label>
                            </div>
                            <div class="col-md-1" style="margin-top: 10px;"><b>甜度</b></div>
                            <div class="col-md-2">
                                <label for="sweetness" class="field prepend-icon">
                                    <input type="number" name="sweetness" id="sweetness" class="gui-input" placeholder=${cakeInfo.sweetness} required min="1" max="5" value=${cakeInfo.sweetness}>
                                    <label for="sweetness" class="field-icon">
                                        <i class="fa fa-star"></i>
                                    </label>
                                </label>
                            </div>
                        </div>
                            <div class="section row">
                                <div class="col-md-1" style="margin-top: 10px;"><b>价格</b></div>
                                <div class="col-md-2">
                                    <label for="price" class="field prepend-icon">
                                        <input type="text" name="price" id="price" class="gui-input" placeholder=${cakeInfo.price} required value=${cakeInfo.price}>
                                        <label for="price" class="field-icon">
                                            <i class="fa fa-cny"></i>
                                        </label>
                                    </label>
                                </div>
                                <div class="col-md-1" style="margin-top: 10px;"><b>重量</b></div>
                                <div class="col-md-2">
                                    <label for="weight" class="field prepend-icon">
                                        <input type="number" name="weight" id="weight" class="gui-input" placeholder=${cakeInfo.weight} required value=${cakeInfo.weight}>
                                        <label for="weight" class="field-icon">
                                            <i class="fa fa-database"></i>
                                        </label>
                                    </label>
                                </div>
                                <div class="col-md-1" style="margin-top: 10px;"><b>尺寸</b></div>
                                <div class="col-md-2">
                                    <label for="size" class="field prepend-icon">
                                        <input type="number" name="size" id="size" class="gui-input" placeholder=${cakeInfo.size} required value=${cakeInfo.size}>
                                        <label for="size" class="field-icon">
                                            <i class="fa fa-arrows"></i>
                                        </label>
                                    </label>
                                </div>
                            </div>
                            <div class="section row">
                                <div class="col-md-1" style="margin-top: 10px;"><b>材料</b></div>
                                <div class="col-md-8">
                                    <label for="material" class="field prepend-icon">
                                        <input type="text" name="ingredient" id="material" class="gui-input" placeholder=${cakeInfo.ingredient} required value=${cakeInfo.ingredient}>
                                        <label for="material" class="field-icon">
                                            <i class="fa fa-server"></i>
                                        </label>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="panel-footer text-right">
                            <input type="hidden" name="id" id="id" value="${cakeInfo.id}"/>
                            <button type="submit" class="button"> 保存 </button>
                            <button type="button" class="button" onclick="javascript:window.location.href='cake_list.jsp';"> 返回 </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
</section>

<%
String str=request.getParameter("name");
int number= 0;
if(str != null) {
	 number=Integer.parseInt(str);  
}

session.setAttribute("cid",number);

request.setAttribute("cid",number);
%>

</div>
<style>
    /* demo page styles */
    body { min-height: 2300px; }

    .content-header b,
    .admin-form .panel.heading-border:before,
    .admin-form .panel .heading-border:before {
        transition: all 0.7s ease;
    }
    /* responsive demo styles */
    @media (max-width: 800px) {
        .admin-form .panel-body { padding: 18px 12px; }
    }
</style>

<style>
    .ui-datepicker select.ui-datepicker-month,
    .ui-datepicker select.ui-datepicker-year {
        width: 48%;
        margin-top: 0;
        margin-bottom: 0;

        line-height: 25px;
        text-indent: 3px;

        color: #888;
        border-color: #DDD;
        background-color: #FDFDFD;

        -webkit-appearance: none; /*Optionally disable dropdown arrow*/
    }
</style>

<!-- jQuery -->
<script src="../assets/js/jquery.min.js"></script>
<script src="../assets/js/jquery-ui.min.js"></script>
<!-- Theme Javascript -->
<script src="../assets/js/utility.js"></script>
<script src="../assets/js/demo/demo.js"></script>
<script src="../assets/js/main.js"></script>
<script src="../assets/js/pages.js"></script>
<!-- END: PAGE SCRIPTS -->
</body>
<script type="text/javascript" src="../assets/static/js/jquery-3.5.1.js"></script>
<script>
    $("#image").change(function(e) {
        var file = e.target.files[0]
        var img = new Image(), url = img.src = URL.createObjectURL(file)
        img.width=50;
        var $img = $(img)
        img.onload = function() {
            URL.revokeObjectURL(url)
            $('#showImage').empty().append($img)
        }
    })

</script>
<script type="text/javascript">

$("#price").keyup(function(){
    	var c=$(this);
    	if(/[^\d]/.test(c.val())){
    		var temp=c.val().replace(/[^\d]/g,'');
    		$(this).val(temp);
    		alert("请输入大于0的整数");
    	}
})
function getPageData() {
	//var nextPage = 1;
	/*var obj = {
			"nextPage":nextPage
		}*/
	$.ajax({
		async:true,
		url:"/getCatalog",
		type:"post",
		data:null,
		dataType:"json",
		success:function(data) {
			//console.log(data.result);
			for(var i = 0;i<data.result.length;i++) {
				if(data.result[i].levelId == 1) {
					var str = "<option value='"+data.result[i].catalogName+"'>&nbsp;&nbsp;&nbsp;&nbsp;"+data.result[i].catalogName+"</option>";
					$('#language').append(str);
				}
				if(data.result[i].levelId == 2) {
					var str = "<option value='"+data.result[i].catalogName+"'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+data.result[i].catalogName+"</option>";
					$('#language').append(str);
				}
				if(data.result[i].levelId == 3) {
					var str = "<option value='"+data.result[i].catalogName+"'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+data.result[i].catalogName+"</option>";
					$('#language').append(str);
				}
			}
			
			
		}
	})
}
$().ready(function() {
	getPageData();
})

    /*function editProduct() {
        var cake = new Object();
        cake.id = $('id').val();
        cake.cakeName = $("#title").val();
        cake.taste = $("#taste").val();
        cake.sweetness = $("#sweetness").val();
        cake.price = $("#price").val();
        cake.weight = $("#weight").val();
        cake.size = $("#size").val();
        cake.ingredient = $("#material").val();
        $("[name=state]:radio").each(function() {
            if (this.checked) {
                cake.state = $(this).val();
            }
        });
        $("[name=cakeType]").each(function() {
            if (this.selected) {
                cake.cakeType = $(this).val();
            }
        });
        cake.image_path = $("#image").val();
        var cakeStr = JSON.stringify(cake);
        var obj = {
            "param":cakeStr
        }
        $.ajax({
            url:"/editCake",
            async : true,
            type:"post",
            data:obj,
            dataType:"json",
            success:function(data){

                    alert("修改成功");

                    window.location.href = "/cake_list";

        });

    }*/

</script>
</html>
